var TimeDurationInput = function () {
  var template = /* html */ `
    <div class="time-duration-input clearfix">
      <template v-for="timeInput in timeInputList">
        <div :key="'time_'+timeInput.timeType" class="time-duration-item">
          <el-input-number v-model="timeInput.value" :min="0" :max="getTimeInputMax(timeInput)" :precision="0" controls-position="right"
            :style="{width:inputWidth+'px'}" :controls="controls" :size="size" @change="timeChange(timeInput)">
          </el-input-number>
          <span class="time-unit">{{unitObj[timeInput.timeType]}}</span>
        </div>
      </template>
    </div>
  `;

  return {
    props: {
      value: Number,
      type: {
        validator: function (value) {
          return ["hour", "minute", "second"].indexOf(value) !== -1;
        },
        default: "minute"
      },
      dataType: {
        validator: function (value) {
          return ["hour", "minute", "second"].indexOf(value) !== -1;
        },
        default: "hour"
      },
      hasDay: {
        type: Boolean,
        default: true
      },
      inputWidth: {
        type: Number,
        default: 85
      },
      controls: {
        type: Boolean,
        default: false
      },
      size: String
    },

    data: function () {
      var timeInputList = this.getTimeInput();
      return {
        timeInputList: timeInputList,
        unitObj: {
          "hour": "小时",
          "minute": "分",
          "second": "秒"
        }
      };
    },

    methods: {
      getTimeInput: function () {
        var value = this.value;
        var dataType = this.dataType;
        var option = {};
        if (value === undefined) {
          option = null;
        } else {
          option[`${dataType}s`] = value;
        }

        var timeDuration = null;
        if (option !== null) {
          timeDuration = moment.duration(option);
        }

        var type = this.type;
        var timeTypeList = ["hour", "minute", "second"];
        var timeInputList = [];
        for (var i = 0; i < timeTypeList.length; i++) {
          var timeType = timeTypeList[i];

          var timeValue = this.getValueByType(timeType, timeDuration);
          timeInputList.push({
            value: timeValue,
            timeType: timeType
          });

          if (type === timeType) {
            break;
          }
        }
        return timeInputList;
      },

      getValueByType: function (timeType, timeDuration) {
        if (timeDuration === null) {
          return undefined;
        }
        var value;
        switch (timeType) {
          case "hour":
            value = timeDuration.asHours();
            value = Math.floor(value);
            break;
          case "minute":
            value = timeDuration.minutes();
            break;
          case "second":
            value = timeDuration.seconds();
            break;
        }
        return value;
      },

      getTimeInputMax: function (timeInput) {
        if (!this.hasDay) {
          return Infinity;
        }
        var timeType = timeInput.timeType;
        if (timeType === 'hour') {
          return 24;
        }

        var timeInputList = this.timeInputList;
        var value = timeInputList[0].value;
        if (value === 24) {
          return 0;
        }
        return 59;
      },

      timeChange: function (timeInput) {
        var timeInputList = this.timeInputList;
        if (this.hasDay && timeInput.timeType === 'hour' && timeInput.value === 24) {
          for (var i = 1; i < timeInputList.length; i++) {
            var obj = timeInputList[i];
            obj.value = 0;
          }
        }
        var time = this.getValue();
        if (this.value === time) {
          return;
        }
        this.$emit('input', time);
        this.$emit('change', time);
      },

      getValue: function () {
        var timeInputList = this.timeInputList;
        var option = {};
        for (var i = 0; i < timeInputList.length; i++) {
          var timeInput = timeInputList[i];
          var value = timeInput.value;
          if (value === undefined) {
            continue;
          }
          var timeType = timeInput.timeType;
          option[`${timeType}s`] = value;
        }
        if (SysUtil.isEmpty(option)) {
          return undefined;
        }

        var dataType = this.dataType;
        dataType = SysUtil.firstWordUpperCase(dataType);
        var value = moment.duration(option)[`as${dataType}s`]();
        return value;
      }
    },

    template: template
  };
}();
